<!--
 * @Descripttion: 
 * @Author: junjiaHuang
 * @Date: 2020-08-26 17:50:14
 * @LastEditors: junjiaHuang
 * @LastEditTime: 2020-08-28 09:47:52
-->
<template>
<div class="home">
  {{name}}
  {{count}}
  {{object.foo}}
  <div v-html="count"></div>
</div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'
import {getCurrentInstance} from "vue";
import {
  ref,
  reactive
} from 'vue'

export default {
  name: 'Home',
  inject: ['test'], // 依赖注入
  data() {
    return {
      name: 'hellow', 
    }
  },
  setup(props, ctx) {
    const count = ref('<h3>2</h3>')
    const object = reactive({ // 影响所有属性 等于深度响应data
      foo: 'bar'
    })
    console.log(count)
    console.log(object)
    return {
      count,
      object
    }
  },
  created() {
    console.log('home')
    console.log(this)
    console.log(getCurrentInstance());
    // this.test() // 执行依赖注入方法
    // this.$getTest() // 执行工具方法
    
  }
}
</script>
